
<link href="../addons/jy_aihire/resource/css/diy.css?v=202107" rel="stylesheet">
<style type="text/css">
._4v0zALg3Ub .ant-radio-group,.LAHntCoyJ5 {
	display:flex
}
.LAHntCoyJ5 {
	margin:10px 0;
	flex-wrap:wrap;
	overflow-y:scroll;
	max-height:300px;
	margin-left:13%;
	padding:10px;
	border-radius:5px;
	width:60%;
	background:#f9fafb
}
.kOQc3BARVV {
	display:flex;
	padding:15px 0;
	font-size:14px;
	min-height:560px
}
.kOQc3BARVV ._2YhAAmFiEF {
	padding:15px;
	font-size:14px;
	background:#fff;
	margin-bottom:15px
}
.kOQc3BARVV ._2YhAAmFiEF h5 {
	font-size:16px;
	margin-bottom:10px
}
.kOQc3BARVV ._2Ypb9ijVXU {
	-webkit-box-flex:1;
	-webkit-flex:auto;
	-ms-flex:auto;
	flex:auto;
	padding-right:14px
}
.kOQc3BARVV ._2Ypb9ijVXU ._3KYGNvM2X- {
	width:100%;
	height:100%
}
.kOQc3BARVV ._2ApUZUAVTS {
	flex:0 0 300px;
	background:#fff;
	width:260px
}
.kOQc3BARVV ._1Q3_kxs-1p {
	font-size:16px;
	color:#333;
	letter-spacing:0;
	line-height:16px;
	padding:15px;
	padding-left:0
}
.kOQc3BARVV ._19iZJF_gRr {
	min-height:150px;
	display:block;
	position:relative;
	padding:0 0 20px
}
.kOQc3BARVV ._3BjNM7ik9r {
	min-height:150px
}
.kOQc3BARVV ._11mczdXL5G {
	background:#fff;
	width:100%;
	min-height:400px
}
.kOQc3BARVV ._1zTbTN5Tyw {
	display:block;
	position:relative;
	padding:0 0 20px;
	min-height:50px
}
._1fis-qRuUN {
	padding:24px;
	min-height:680px
}
._1fis-qRuUN ._2HbvQR1pjL {
	display:flex;
	margin-top:32px
}
._1fis-qRuUN ._2HbvQR1pjL ._3KYGNvM2X- {
	flex:1
}
._1fis-qRuUN ._2HbvQR1pjL ._1gqcfPG_87 {
	width:320px;
	padding-left:48px
}
._1fis-qRuUN .nxe7yLAr-m {
	width:96px;
	height:96px;
	position:relative;
	display:inline-block;
	float:left;
	margin-right:32px;
	margin-bottom:32px
}
._1fis-qRuUN .nxe7yLAr-m img {
	width:96px;
	height:96px
}
._1fis-qRuUN .nxe7yLAr-m ._1QwkV15gaB {
	margin-right:8px;
	cursor:pointer
}
._1fis-qRuUN .nxe7yLAr-m ._2Z-S6uMWwQ {
	display:none;
	background-color:rgba(0,0,0,.65);
	position:absolute;
	bottom:0;
	left:0;
	width:96px;
	height:96px;
	line-height:96px;
	text-align:center;
	transition:all .3s;
	color:#fff
}
._1fis-qRuUN .nxe7yLAr-m:hover ._2Z-S6uMWwQ {
	display:block
}
._1fis-qRuUN ._3Y4iBaIyNb {
	position:fixed;
	bottom:32px;
	width:100%;
	text-align:center
}
._3pCXWWsCHe {
	height:24px;
	line-height:24px;
	margin-right:8px;
	margin-bottom:5px;
	background:transparent;
	border:0;
	outline:none;
	position:relative
}
._3pCXWWsCHe img {
	position:absolute;
	top:-5px;
	right:-5px;
	z-index:999
}
.qHzsIInGYv {
	top:0;
	overflow:hidden
}
._5szRDzvm3U,.qHzsIInGYv {
	width:100%;
	position:absolute;
	bottom:0
}
._5szRDzvm3U {
	height:60px;
	background:#fff;
	text-align:right;
	border-top:1px solid #e3e3e3
}
._5szRDzvm3U ._2gVCdScuU4 {
	height:60px;
	line-height:60px;
	text-align:left;
	display:inline-block
}
._5szRDzvm3U ._2gVCdScuU4 button {
	margin-right:16px
}
._1VRZ6MbTQL {
	position:absolute;
	width:100%;
	top:40px;
	bottom:53px;
	background:#fff;
	padding:8px;
	overflow:auto
}
._1VRZ6MbTQL .CBe418wsGK {
	position:relative;
	padding:22px 0 0;
	text-align:center
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr {
	width:100%;
	min-height:180px;
	border:1px dashed #eaeaea;
	border-radius:2px;
	background:#fff;
	padding:20px 40px;
	position:relative;
	display:inline-block;
	text-align:left
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw._3kHFaFP8Cx:hover ._269W99goHe {
	display:block
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw._3kHFaFP8Cx:hover ._2l6t4D8cdv {
	display:none
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw {
	height:120px;
	width:90px;
	position:absolute;
	left:30px;
	top:30px;
	border-radius:2px;
	-webkit-border-radius:2px;
	-o-border-radius:2px;
	-moz-border-radius:2px;
	border:1px solid #eaeaea;
	background-image:url("img/staff_ser_hand_wps.png");
	background-repeat:no-repeat;
	background-position:22px 22px
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw img {
	max-width:100%;
	max-height:100%;
	display:block;
	width:100%
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw ._269W99goHe {
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	display:none;
	background:rgba(57,64,71,.4)
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw .PVPKWWlVIy {
	width:60px;
	margin:45px auto 0;
	height:30px;
	font-size:12px;
	border:1px solid #fff;
	border-radius:2px;
	margin:40px auto 0;
	background:transparent;
	line-height:30px;
	text-align:center;
	color:#fff;
	display:block
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2QdmTGjzGw ._2l6t4D8cdv {
	height:24px;
	line-height:24px;
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
	font-size:12px;
	color:#fff;
	text-align:center;
	display:block;
	background:rgba(57,64,71,.3)
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._1PKmo7V73_ {
	margin:40px 0 0 120px;
	width:550px
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._1PKmo7V73_ h3 {
	font-size:16px;
	font-weight:400;
	word-wrap:break-word;
	word-break:break-all
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._1PKmo7V73_ ._2B_EyhtJU4 {
	padding:10px 0 0;
	font-size:12px;
	position:relative
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._1PKmo7V73_ ._2B_EyhtJU4 span {
	color:#a6a6a6
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2WCxeOlPPj {
	position:absolute;
	right:30px;
	top:30px
}
._1VRZ6MbTQL .CBe418wsGK ._2AHUBpJmcr ._2WCxeOlPPj ._1llu-eFe8r {
	display:inline-block;
	text-align:right
}
._1VRZ6MbTQL ._1QTHBnJfhm {
	position:relative;
	padding:60px 0 0;
	width:1018px;
	min-height:180px;
	margin:0 auto
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1Q3_kxs-1p {
	font-size:18px;
	color:#333;
	letter-spacing:.64px
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1Q3_kxs-1p:before {
	content:" ";
	display:inline-block;
	height:16px;
	border:2px solid #1089ee;
	margin-top:-4px;
	border-radius:4px;
	vertical-align:middle;
	margin-right:6px
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1AfxsLBsG7 {
	display:flex
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1AfxsLBsG7 ._30zARbZsA1 {
	width:96px;
	height:96px;
	text-align:center;
	position:relative;
	border:1px dashed #dfdfdf;
	cursor:pointer
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1AfxsLBsG7 .R1v_ct41ib {
	display:none;
	line-height:96px
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1AfxsLBsG7 ._30zARbZsA1:hover .R1v_ct41ib {
	display:block
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1AfxsLBsG7 .ty_0vBZxHo {
	position:relative;
	display:inline-block;
	width:157px;
	text-align:right;
	font-weight:700;
	color:rgba(0,0,0,.85)
}
._1VRZ6MbTQL ._1QTHBnJfhm ._1AfxsLBsG7 .ty_0vBZxHo:after {
	content:":";
	margin:0 8px 0 2px;
	position:relative;
	top:-.5px
}
._1KSzIT_V19 {
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background:rgba(0,0,0,.4);
	z-index:10000;
	display:none;
	text-align:center
}
._1KSzIT_V19 ._2Vk2cYXe_S {
	position:absolute;
	color:#fff;
	font-size:30px;
	height:30px;
	line-height:30px;
	left:50%;
	margin-left:430px;
	top:35px
}
._1KSzIT_V19 ._2Vk2cYXe_S i {
	cursor:pointer
}
._1KSzIT_V19 ._1y4IOX2k-4 {
	width:820px;
	position:absolute;
	top:55px;
	bottom:60px;
	background:#e6e6e6;
	overflow:auto;
	display:block;
	left:50%;
	margin-left:-410px
}
._1KSzIT_V19 ._1y4IOX2k-4 .LTIF-6oB3S {
	margin-bottom:8px
}
._1KSzIT_V19 ._1y4IOX2k-4 .LTIF-6oB3S img {
	width:100%
}
._1KSzIT_V19 .sx2nXMo4VH {
	width:820px;
	text-align:center;
	position:absolute;
	bottom:30px;
	font-size:14px;
	height:30px;
	line-height:30px;
	left:50%;
	margin-left:-410px
}
._1KSzIT_V19 .sx2nXMo4VH ._2Gf8KMeIxG {
	color:#fff
}
._1KSzIT_V19._3kHFaFP8Cx {
	display:block
}
.ZpZK8Mz883 {
	position:absolute;
	width:100%;
	top:0;
	bottom:53px;
	background:#fff;
	padding:0
}
.ZpZK8Mz883 .fs_hxQwg1v {
	height:100%;
	background:#f1f1f1
}
.ZpZK8Mz883 ._1UIp-QQQYd,.ZpZK8Mz883 ._2R_kLmSjNM,.ZpZK8Mz883 .M_k_Wqaxd2 {
	background:#fff
}
.ZpZK8Mz883 .M_k_Wqaxd2 {
	padding:20px;
	border-right:1px solid #eaeaea;
	height:100%;
	overflow:auto
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._3dYwbbiZ3c h3 {
	font-size:16px;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	font-weight:400
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._3dYwbbiZ3c p {
	font-size:12px;
	color:#a6a6a6;
	line-height:18px;
	margin-top:5px
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._191ELPgrrX .ant-form-item {
	margin-bottom:0
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._191ELPgrrX .Y6O0K0FPrL {
	font-size:16px;
	color:#333;
	margin-top:20px
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._191ELPgrrX ._1_n4CkXO5_ {
	color:#faad14
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2C57L9bFxo li {
	width:60px;
	height:60px;
	display:inline-block;
	border:1px solid #f0f1f4;
	text-align:center;
	padding:15px 10px;
	border-radius:2px;
	margin:16px;
	position:relative
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2C57L9bFxo li img {
	width:40px
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2C57L9bFxo li ._1s3wYAeCxX {
	width:72px;
	position:absolute;
	bottom:-22px;
	left:-6px;
	font-size:12px;
	color:#9e9e9e
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2C57L9bFxo li:hover {
	border-color:#1890ff;
	cursor:pointer
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._1aNiQAlpl0 {
	padding:8px 0
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._1aNiQAlpl0 ._1mQ__Kw-n8 {
	position:relative
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._1aNiQAlpl0 ._1mQ__Kw-n8 h3 {
	font-size:16px;
	color:#333;
	display:inline-block;
	font-weight:400
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._1aNiQAlpl0 ._1mQ__Kw-n8 i {
	font-size:12px;
	position:absolute;
	top:4px;
	left:165px;
	color:#999;
	cursor:pointer
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._1aNiQAlpl0 ._3WfOi0y6RF {
	margin-top:8px
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2VOA4fSy-3 {
	padding:8px 0
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2VOA4fSy-3 ._1mQ__Kw-n8 {
	position:relative
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2VOA4fSy-3 ._1mQ__Kw-n8 h3 {
	font-size:16px;
	color:#333;
	display:inline-block;
	font-weight:400
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2VOA4fSy-3 ._1mQ__Kw-n8 i {
	font-size:12px;
	position:absolute;
	top:4px;
	left:165px;
	color:#999;
	cursor:pointer
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._2VOA4fSy-3 ._3WfOi0y6RF {
	margin-top:8px
}
.ZpZK8Mz883 .M_k_Wqaxd2 ._3SYFFUwSy1 {
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	top:300px;
	padding:0 20px
}
.ZpZK8Mz883 ._2R_kLmSjNM {
	min-width:820px;
	background:#f1f1f1
}
.ZpZK8Mz883 ._2R_kLmSjNM ._2ukBSSf0rr {
	box-shadow:0 4px 4px 5px rgba(0,0,0,.03);
	width:817px;
	margin:0 auto;
	height:100%;
	overflow:auto;
	background:#fff
}
.ZpZK8Mz883 ._2R_kLmSjNM ._2ukBSSf0rr ._2SaT1auwLv {
	position:relative
}
.ZpZK8Mz883 ._2R_kLmSjNM ._2ukBSSf0rr ._2SaT1auwLv img {
	width:100%
}
.ZpZK8Mz883 ._2R_kLmSjNM ._2ukBSSf0rr div ._2SaT1auwLv {
	border-bottom:1px solid #000
}
.ZpZK8Mz883 ._2R_kLmSjNM ._2ukBSSf0rr div:last-child ._2SaT1auwLv {
	border-bottom:1px solid transparent
}
.ZpZK8Mz883 ._1UIp-QQQYd {
	padding:20px;
	border-left:1px solid #eaeaea
}
.ZpZK8Mz883 ._1UIp-QQQYd ._3dYwbbiZ3c h3 {
	font-size:16px;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	font-weight:400
}
.ZpZK8Mz883 ._1UIp-QQQYd ._3dYwbbiZ3c p {
	font-size:12px;
	color:#a6a6a6;
	line-height:18px;
	margin-top:5px
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 {
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	top:60px;
	overflow:auto
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul {
	width:108px;
	margin:0 auto
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul li {
	width:100%;
	margin:0 auto 20px;
	height:150px;
	border:1px solid #eaeaea;
	box-sizing:border-box;
	cursor:pointer;
	position:relative
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul li img {
	height:100%;
	width:100%
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul li._2hJhEakEjN {
	border:2px solid #1890ff;
	color:#fff
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul li._2hJhEakEjN ._1LHzOomcE7 {
	background:#1890ff;
	color:#fff
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul li:hover {
	border:2px solid #1890ff;
	color:#fff
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ul li:hover ._1LHzOomcE7 {
	background:#1890ff;
	color:#fff
}
.ZpZK8Mz883 ._1UIp-QQQYd .w1fSnheEp0 ._1LHzOomcE7 {
	position:absolute;
	right:0;
	bottom:0;
	height:18px;
	width:18px;
	display:block;
	background:#eaeaea;
	line-height:18px;
	color:#fff;
	text-align:center;
	font-size:12px
}
.vVjQs3ggeb {
	z-index:99;
	text-align:center;
	padding:1px;
	border:1px dashed transparent;
	border-radius:2px;
	background:rgba(24,144,255,.2);
	color:#2a2a2a
}
.vVjQs3ggeb p {
	border:1px dashed #1890ff;
	font-size:14px;
	background:hsla(0,0%,100%,.9)
}
.vVjQs3ggeb.p-9_ovwfeg {
	width:131px
}
.vVjQs3ggeb.p-9_ovwfeg p {
	width:131px;
	height:36px;
	line-height:36px
}
.vVjQs3ggeb.tAUNK-ebwp {
	width:220px
}
.vVjQs3ggeb.tAUNK-ebwp p {
	width:220px;
	height:80px;
	line-height:80px
}
.vVjQs3ggeb._6m0KQYxJhL {
	width:130px
}
.vVjQs3ggeb._6m0KQYxJhL p {
	width:130px;
	height:74px;
	line-height:74px
}
.vVjQs3ggeb._3Le21AYgG_ {
	width:130px
}
.vVjQs3ggeb._3Le21AYgG_ p {
	width:160px;
	height:160px;
	line-height:160px
}
.vVjQs3ggeb.Jvefiky0Ha {
	width:130px
}
.vVjQs3ggeb.Jvefiky0Ha p {
	width:120px;
	height:160px;
	line-height:160px
}
.XgAaVHnhDV {
	display:inline-block
}
.XgAaVHnhDV .mglAsOdyb0 {
	border:1px solid #f36;
	z-index:90;
	background:hsla(0,0%,100%,.3);
	border:1px solid transparent;
	text-align:center;
	padding:5px;
	border-radius:2px;
	cursor:move
}
.XgAaVHnhDV .mglAsOdyb0 ._2fzTvH5mxm {
	position:absolute;
	height:10px;
	width:15px;
	border-radius:50%;
	display:block;
	background:#fff;
	top:-10px;
	right:-10px;
	cursor:pointer
}
.XgAaVHnhDV .mglAsOdyb0 ._2fzTvH5mxm i {
	font-size:14px;
	color:red
}
.XgAaVHnhDV .mglAsOdyb0 ._2icuPD39D-,.XgAaVHnhDV .mglAsOdyb0 ._3SO1HLZhWz,.XgAaVHnhDV .mglAsOdyb0 ._23OJYfkJHh {
	height:15px;
	width:15px;
	position:absolute
}
.XgAaVHnhDV .mglAsOdyb0 ._3SO1HLZhWz {
	top:-12px;
	left:-8px;
	cursor:nw-resize
}
.XgAaVHnhDV .mglAsOdyb0 ._3SO1HLZhWz:before {
	content:"";
	height:4px;
	width:4px;
	display:inline-block;
	border:1px solid #ff3756;
	background:#fff
}
.XgAaVHnhDV .mglAsOdyb0 ._2icuPD39D- {
	bottom:-4px;
	right:-8px;
	cursor:se-resize
}
.XgAaVHnhDV .mglAsOdyb0 ._2icuPD39D-:before {
	content:"";
	height:4px;
	width:4px;
	display:inline-block;
	border:1px solid #ff3756;
	background:#fff
}
.XgAaVHnhDV .mglAsOdyb0 ._23OJYfkJHh {
	bottom:-4px;
	left:-8px;
	cursor:sw-resize
}
.XgAaVHnhDV .mglAsOdyb0 ._23OJYfkJHh:before {
	content:"";
	height:4px;
	width:4px;
	display:inline-block;
	border:1px solid #ff3756;
	background:#fff
}
._2SFJaku_u2 {
	position:fixed;
	z-index:1001;
	background:#fff;
	width:280px;
	overflow:hidden;
	border:1px solid #f0f1f4;
	box-shadow:0 4px 12px 0 rgba(0,0,0,.2);
	border-radius:4px
}
._2SFJaku_u2 ._1mQ__Kw-n8 {
	height:42px;
	width:100%;
	background:#f0f1f4;
	padding:0 8px;
	cursor:move
}
._2SFJaku_u2 ._1mQ__Kw-n8 h3 {
	font-size:18px;
	color:#333;
	display:inline-block;
	line-height:42px
}
._2SFJaku_u2 ._1mQ__Kw-n8 i {
	color:#6c7596;
	position:absolute;
	right:8px;
	top:12px;
	font-size:16px;
	cursor:pointer
}
._2SFJaku_u2 ._3WfOi0y6RF {
	padding:8px 20px
}
.VXd6-R9pXl {
	display:block
}
._2LbUP56-eU {
	display:none
}

</style>
<div class="page" ng-if="pagedata.op=='diy'">
<div class="ant-layout ant-layout-has-sider" style="height: 100%; background: rgb(255, 255, 255);">
 <div class="ant-layout-content" style="min-height: 1000px; max-height: 100%; position: relative; overflow: auto;">
                      <div style="position: relative; overflow: hidden; width: 100%; height: 100%;">
                        <div id="main_scroll_bar" class="_2AVMmKXQG9" style="position: absolute; inset: 0px -17px -17px 0px; overflow: scroll; padding-right: 10px; background: transparent;">
                          <div>
                            <div class="qHzsIInGYv">
                              <div class="_1KSzIT_V19">
                                <div class="_2Vk2cYXe_S">
                                  <i class="anticon anticon-close"></i>
                                </div>
                                <div class="_1y4IOX2k-4" id="pics_contract_wrap">
                                  <div class="LTIF-6oB3S">
                                    <img id="pic_wrap0" src="../addons/jy_aihire/resource/images/demotpl.png.png" alt="" style="user-select: none;">
									</div>
                                  <div class="LTIF-6oB3S">
                                    <img id="pic_wrap1" src="../addons/jy_aihire/resource/images/demotpl.png" alt="" style="user-select: none;">
									</div>
                                </div>
                                <div class="sx2nXMo4VH">
                                  <p class="_2Gf8KMeIxG">
                                    <!-- react-text: 4666 -->第
                                    <!-- /react-text -->
                                    <span>1</span>
                                    <!-- react-text: 4668 -->页/共
                                    <!-- /react-text -->
                                    <span>20</span>
                                    <!-- react-text: 4670 -->页
                                    <!-- /react-text --></p></div>
                              </div>
                              <div>
                                <div class="ZpZK8Mz883">
                                  <div id="field_modal" class="_2SFJaku_u2 _2LbUP56-eU" style="left: 0px; top: 0px;">
                                    <div class="_1mQ__Kw-n8">
                                      <h3>
                                        <!-- react-text: 4728 -->设置
                                        <!-- /react-text -->
                                        <!-- react-text: 4729 -->多行文本
                                        <!-- /react-text --></h3>
                                      <i class="anticon anticon-close"></i>
                                    </div>
                                    <div class="_3WfOi0y6RF dragFormVertical">
                                      <form class="ant-form ant-form-vertical">
                                        <div class="ant-row ant-form-item">
                                          <div class="ant-form-item-label">
                                            <label class="ant-form-item-required" title="填写方">填写方</label></div>
                                          <div class="ant-form-item-control-wrapper">
                                            <div class="ant-form-item-control ">
                                              <div class="ant-select-lg ant-select ant-select-enabled">
                                                <div class="ant-select-selection
                                                ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" tabindex="0">
                                                  <div class="ant-select-selection__rendered">
                                                    <div class="ant-select-selection-selected-value" title="2" style="display: block; opacity: 1;">2</div></div>
                                                  <span class="ant-select-arrow" unselectable="unselectable" style="user-select: none;">
                                                    <b>
                                                    </b>
                                                  </span>
                                                </div>
                                              </div>
                                            </div>
                                          </div>
                                        </div>
                                        <div class="ant-row ant-form-item">
                                          <div class="ant-form-item-label">
                                            <label class="ant-form-item-required" title="文本类型">文本类型</label></div>
                                          <div class="ant-form-item-control-wrapper">
                                            <div class="ant-form-item-control has-error">
                                              <div class="ant-select-lg ant-select ant-select-enabled">
                                                <div class="ant-select-selection
                                                ant-select-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" tabindex="0">
                                                  <div class="ant-select-selection__rendered">
                                                    <div class="ant-select-selection-selected-value" title="" style="display: block; opacity: 1;"></div>
                                                  </div>
                                                  <span class="ant-select-arrow" unselectable="unselectable" style="user-select: none;">
                                                    <b>
                                                    </b>
                                                  </span>
                                                </div>
                                              </div>
                                            </div>
                                          </div>
                                        </div>
                                        <div class="ant-row ant-form-item">
                                          <div class="ant-form-item-label">
                                            <label class="ant-form-item-required" title="文本框名称">文本框名称</label></div>
                                          <div class="ant-form-item-control-wrapper">
                                            <div class="ant-form-item-control ">
                                              <input type="text" name="fields.name" value="企业签章位置" placeholder="" class="ant-input ant-input-lg"></div>
                                          </div>
                                        </div>
                                        <div class="ant-row ant-form-item">
                                          <div class="ant-form-item-label">
                                            <label class="" title="当前最多字数（模版中拖拽文本框更改）">当前最多字数（模版中拖拽文本框更改）</label></div>
                                          <div class="ant-form-item-control-wrapper">
                                            <div class="ant-form-item-control ">
                                              <input type="text" disabled="" name="fields.max_word" value="8" placeholder="" class="ant-input ant-input-lg ant-input-disabled"></div>
                                          </div>
                                        </div>
                                      </form>
                                    </div>
                                  </div>
                                  <!-- react-empty: 5028 -->
                                  <div class="fs_hxQwg1v ant-layout ant-layout-has-sider">
                                    <div class="M_k_Wqaxd2 ant-layout-sider" style="display: flex; flex-direction: column; flex: 0 0 240px; max-width: 240px; min-width: 240px; width: 240px;">
                                      <div class="ant-layout-sider-children">
                                        <div class="_3dYwbbiZ3c">
                                          <h3>添加控件</h3>
                                          <p>点按并且拖拽到文件内容中</p>
                                        </div>
                                        <div class="_2C57L9bFxo">
                                          <ul>
                                            <div draggable="true" id="0" ondragstart="drag(event,1)" style="display: inline-block;">
                                              <li id="0">
                                                <span id="0" class="ant-badge">
                                                  <img id="0" src="" alt="" style="width: 20px; vertical-align: -webkit-baseline-middle;">
                                                </span>
                                                <div class="_1s3wYAeCxX">单行文本</div></li>
                                            </div>
                                            <div draggable="true" id="1" ondragstart="drag(event,1)" style="display: inline-block;">
                                            <li>
                                                <span class="ant-badge">
                                                  <img src="" alt="">
                                                </span>
                                                <div class="_1s3wYAeCxX">多行文本</div>
											</li>
                                            </div>
                                            <div draggable="true" id="2" ondragstart="drag(event,1)" style="display: inline-block;">
                                              <li>
                                                <img src="" alt="">
                                                <div class="_1s3wYAeCxX">个人签章位置</div></li>
                                            </div>
                                            <div draggable="true" id="3" ondragstart="drag(event,1)" style="display: inline-block;">
                                              <li>
                                                <img src="" alt="">
                                                <div class="_1s3wYAeCxX">企业签章位置</div></li>
                                            </div>
                                            <div draggable="true" id="4" ondragstart="drag(event,1)" style="display: inline-block;">
                                              <li>
                                                <img src=""
                                                alt="">
                                                <div class="_1s3wYAeCxX">骑缝章</div></li>
                                            </div>
                                          </ul>
                                        </div>
                                        <div style="overflow: auto;">
                                          <div class="_1aNiQAlpl0">
                                            <div class="_1mQ__Kw-n8" style="cursor: pointer;">
                                              <h3>快速插入公司填写字段</h3>
											  <div class="_3WfOi0y6RF">
													<div ng-repeat="v in pagedata.zujian2" id="{{$index}}" draggable="true" ondragstart="drag(event,2)" style="display: inline-block;">
														<button type="button" class="ant-btn ant-btn-sm" style="margin-right: 8px; margin-bottom: 8px;">
														  <span>{{v.title}}</span>
														</button>
													</div>
												</div>
                                            </div>
                                          </div>
                                          <div class="_2VOA4fSy-3" style="padding-bottom: 50px;">
                                            <div class="_1mQ__Kw-n8" style="cursor: pointer;">
                                              <h3>快速插入个人填写字段</h3></div>
                                            <div class="_3WfOi0y6RF">
                                              <div ng-repeat="v in pagedata.zujian3" id="{{$index}}" draggable="true" ondragstart="drag(event,3)" style="display: inline-block;">
                                                <button type="button" class="ant-btn ant-btn-sm" style="margin-right: 8px; margin-bottom: 8px;">
                                                  <span>{{v.title}}</span>
												</button>
                                              </div>
                                            </div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                    <div class="_2R_kLmSjNM ant-layout-content">
                                      <div class="_2ukBSSf0rr" id="contract_wrap_body">
                                        <div ng-repeat="(k,img) in pagedata.item.images" style="border: 1px dashed transparent;">
                                          <div id="page{{k}}" ondrop="drop(event)" ondragover="allowDrop(event)" class="_2SaT1auwLv" style="border-bottom: 1px solid rgb(0, 0, 0);">
                                            <img id="page{{k}}" draggable="false" ng-src="{{tomedia(img)}}" alt="" style="user-select: none;">
                                            <div class="XgAaVHnhDV">
                                              <div ng-repeat="v in pagedata.item.diys track by $index" ng-if="v.page=='page'+k" draggable="true" class="mglAsOdyb0" style="position: absolute; top: {{v.top}}px; left: {{v.left}}px; width: {{v.width}}px; height: {{v.height}}px; border: 1px solid rgb(255, 51, 102); padding: 4px 6px;">
												<div ng-if="v.type==2 || v.type==3 || v.type==4" style="background-color: rgb(255, 255, 255); width: 100%; height: 100%; line-height:{{v.height}}px; opacity: 0.6; color: rgb(255, 0, 0);">{{v.title}}</div>
												<div ng-if="v.type==0" style="z-index: 100; position: absolute; inset: 4px 6px;">
													<input ng-disabled="v.read" type="text" ng-model="v.data" placeholder="{{v.title||'单行文本'}}" id="" class="ant-input" style="width: 100%; min-height: 24px; height: 100%; opacity: 0.8; color: rgb(255, 0, 0);">
												</div>
												<div ng-if="v.type==1" style="z-index: 100; position: absolute; inset: 4px 6px;">
													<textarea type="text" ng-model="v.data" placeholder="{{v.title||'多行文本'}}" id="" class="ant-input" style="width: 100%; min-height: 4px; height: 100%; opacity: 0.8; color: rgb(255, 0, 0);">多行文本</textarea>
												</div>
												<p class="_2fzTvH5mxm">
												<i class="anticon anticon-close-circle"></i>
												</p>
                                              </div>
                                            </div>
                                          </div>
                                        </div>
                                      </div>
                                    </div>
                                    <div class="_1UIp-QQQYd ant-layout-sider" style="flex: 0 0 180px; max-width: 180px; min-width: 180px; width: 180px;">
                                      <div class="ant-layout-sider-children">
                                        <div class="_3dYwbbiZ3c">
                                          <h3>企业签署W</h3>
                                          <p>
                                            <!-- react-text: 4904 -->共
                                            <!-- /react-text -->
                                            <!-- react-text: 4905 -->20
                                            <!-- /react-text -->
                                            <!-- react-text: 4906 -->页
                                            <!-- /react-text -->
                                            <!-- react-text: 4907 -->（双方签署）
                                            <!-- /react-text --></p></div>
                                        <div class="w1fSnheEp0" id="pic_navigator_wrap">
                                          <ul>
                                            <li id="pic_navigator_item0" class="">
                                              <img draggable="false" src="../addons/jy_aihire/resource/images/demotpl.png" alt="" style="user-select: none;">
                                              <i class="_1LHzOomcE7">1</i></li>
                                            
                                            <li id="pic_navigator_item19" class="_2hJhEakEjN">
                                              <img draggable="false" src="../addons/jy_aihire/resource/images/demotpl.png" alt="" style="user-select: none;">
                                              <i class="_1LHzOomcE7">20</i></li>
                                          </ul>
                                        </div>
                                      </div>
                                    </div>
                                  </div>
                                </div>
                              </div>
                              <div class="_5szRDzvm3U">
                                <div class="_2gVCdScuU4">
                                  <button type="button" class="ant-btn">
                                    <span>上一步</span></button>
                                  <button type="button" class="ant-btn">
                                    <span>预 览</span></button>
                                  <span style="display: inline-block; cursor: not-allowed;">
                                    <button disabled="" type="button" class="ant-btn ant-btn-primary" style="pointer-events: none;">
                                      <span>保 存</span></button>
                                  </span>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                        <div style="position: absolute; height: 6px;">
                          <div style="position: relative; display: block; height: 100%; width: 0px;"></div>
                        </div>
                        <div style="position: absolute; width: 8px; right: 0px; bottom: 2px; top: 2px; border-radius: 3px; cursor: pointer; z-index: 2;">
                          <div style="transition: opacity 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s; position: relative; display: block; width: 100%; cursor: pointer; border-radius: inherit; background-color: rgba(0, 0, 0, 0.2); height: 0px; transform: translateY(0px);"></div>
                        </div>
                      </div>
                    </div>
</div>
</div>
<script>
function drag(ev,type){
	console.log(ev.target.id);
	if(type==1){
		 scope.pagedata.nowdata=scope.pagedata.zujian1[ev.target.id]
	}else if(type==2){
		 scope.pagedata.nowdata=scope.pagedata.zujian2[ev.target.id]
	}else if(type==3){
		 scope.pagedata.nowdata=scope.pagedata.zujian3[ev.target.id]
	}
   scope.pagedata.isdrag=true;
}
function allowDrop(ev){
	//console.log('allowDrop');
	//console.log(ev.target.id);
	ev.preventDefault();
}
function drop(ev){
	if(!scope.pagedata.isdrag){
		return false;
	}
	console.log('drop');
	console.log(ev.target.id);
	var nowdata=scope.pagedata.nowdata
	nowdata.key=scope.pagedata.item.diys.length;
	nowdata.page=ev.target.id;
	nowdata.top=ev.layerY
	nowdata.left=ev.layerX
	scope.pagedata.item.diys = scope.pagedata.item.diys.concat(nowdata)
	scope.pagedata.isdrag=false;
	scope.$evalAsync();
}
require(['jquery.ui'], function (jqueryUI) {
	$( "#draggable" ).draggable();
});
</script>